<template>
	<view class="my_content">
		<!-- 1货运代理  2国际物流公司 3司机 4业务员 5服务公司 6采购商 7供应商 -->
		<image v-if="role==1" class="user_imgs" src="@/static/homePage/hydl.png" mode=""></image>
		<image v-if="role==2" class="user_imgs" src="@/static/homePage/gjwlgs.png" mode=""></image>
		<image v-if="role==3" class="user_imgs" src="@/static/homePage/sj.png" mode=""></image>
		<image v-if="role==4" class="user_imgs" src="@/static/homePage/ywy.png" mode=""></image>
		<image v-if="role==5" class="user_imgs" src="@/static/homePage/fwgs.png" mode=""></image>
		<image v-if="role==6" class="user_imgs" src="@/static/homePage/cgs.png" mode=""></image>
		<image v-if="role==7" class="user_imgs" src="@/static/homePage/gys.png" mode=""></image>
		<!-- 角色名称 -->
		<Information :message="userInfo" :lang="lang" />
		<!-- 采购范围 一级类目二级类目 -->
		<!-- <cgsTwelveVue v-if="(role==6)||(role==7)" /> -->
		<!-- 产品介绍 -->
		<gysSixteenVue :message="userInfo" :lang="lang" v-if="(role==7)" />
		<!-- 宣传视频  -->
		<cgsThirteenVue :message="userInfo" :lang="lang" v-if="(role==6)" />
		<!-- 正在采购 -->
		<!-- <cgsFourteenVue v-if="(role==6)" /> -->
		<!-- 在售商品 -->
		<gysSeventeenVue :message="user_goods" :lang="lang"  v-if="(role==7)" />
		<!-- 采购历史 -->
		<!-- <cgsFifteenVue v-if="(role==6)" /> -->
		<!-- 服务范围 -->
		<!-- <wlTenVue v-if="(role==2)||(role==3 )||(role==5 )" /> -->
		<!-- 提供服务 -->
		<hydlTowVue :message="userInfo" :lang="lang" v-if="role==1" />
		<!-- 通关口岸 -->
		<hydlThreeVue :message="kouan" :lang="lang" :userInfo="userInfo" v-if="(role==1)" />
		<!-- 运输路线 -->
		<hydlForVue :message="luxian" :lang="lang" v-if="(role==1) || (role==2)" />
		<!-- 运输工具 --> 
		<hydlFiveVue :message="user_transport" :lang="lang" v-if="(role==1) || (role==2)||(role==3 )" />
		<!-- 仓库 -->
		<hydlElevenVue :message="warehouse" :lang="lang" v-if="role==1" />
		<!-- 联系方式 -->
		<hydlSixVue :message="userInfo" :lang="lang" v-if="(role==1) || (role==2)||(role==3 )||(role==4 )||(role==5 ) || (role==6)||(role==7)" />
		<!-- 资质证明 -->
		<hydlSevenVue :message="userInfo" :lang="lang"  v-if="role==1" />
		<!-- 成功案例 -->
		<!-- <hydlEightVue v-if="(role==1) || (role==2)" /> -->
		<!-- 用户评价 -->
		<hydlNineVue :message="evaluate" :lang="lang"  v-if="(role==1) || (role==2)||(role==3 )||(role==4 )||(role==5 ) || (role==6)||(role==7)  " />

	</view>
</template>

<script>
	import Information from './components/information.vue';
	import hydlTowVue from './components/hydlTow.vue';
	import hydlThreeVue from './components/hydlThree.vue';
	import hydlForVue from './components/hydlFor.vue';
	import hydlFiveVue from './components/hydlFive.vue';
	import hydlSixVue from './components/hydlSix.vue';
	import hydlSevenVue from './components/hydlSeven.vue';
	import hydlEightVue from './components/hydlEight.vue';
	import hydlNineVue from './components/hydlNine.vue';
	import wlTenVue from './components/wlTen.vue';
	import hydlElevenVue from './components/hydlEleven.vue';
	import cgsTwelveVue from './components/cgsTwelve.vue';
	import cgsThirteenVue from './components/cgsThirteen.vue';
	import cgsFourteenVue from './components/cgsFourteen.vue';
	import cgsFifteenVue from './components/cgsFifteen.vue';
	import gysSixteenVue from './components/gysSixteen.vue';
	import gysSeventeenVue from './components/gysSeventeen.vue';
	import {
		IMAGE_URL,
		HTTP_IMG_UTL
	} from '@/config/app'
	import {
		createC2CConversation,
		ImageUrl
	} from "@/common/public";
	export default {
		components: {
			Information,
			hydlTowVue,
			hydlThreeVue,
			hydlForVue,
			hydlFiveVue,
			hydlSixVue,
			hydlSevenVue,
			hydlEightVue,
			hydlNineVue,
			wlTenVue,
			hydlElevenVue,
			cgsTwelveVue,
			cgsThirteenVue,
			cgsFourteenVue,
			cgsFifteenVue,
			gysSixteenVue,
			gysSeventeenVue
		},
		data() {
			return {
				IMAGE_URL,
				role: 7, //1货运代理  2国际物流公司 3司机 4业务员 5服务公司 6采购商 7供应商
				HTTP_IMG_UTL,
				QList: [
					'视频', '图片'
				],
				videoUrl: 'https://gluz-oss.oss-cn-beijing.aliyuncs.com',
				isShow: false, //控制显示图片还是视频
				list: [],
				count: 5, //评价星，写固定值5
				value: 5, //评价最多显示几个星，固定5星
				IMGURL: '', //地址前缀
				id: '', //传参id
				user: {}, //用户信息
				userObj: {
					userInfo: {}
				}, //全部数据
				lang: 'zh', //国籍
				videoContext: uni.createVideoContext("myVideo", this), //视频实例,
				vip: false,
				report: '',
				mineuser: {},
				vipShow: false,
				QIndex: 1,
				level: 0,
				from: '',
				userInfo: {}, //用户信息
				evaluate:[],//评价
				list:{},
				guanzhu:'',//是否被关注过
				mineuser:{},
				kouan:{},//口岸
				luxian:[],//路线
				user_transport:[],//运输工具
				warehouse:[],//仓库
				user_goods:[],//在售商品
			}
		},
		onLoad(options) {
			if (options.from) {
				this.from = options.from
			}
			const value = uni.getStorageSync('level');
			this.level = value.level
			this.IMGURL = IMAGE_URL
			this.id = options.id
			// 获取用户信息
			this.getData()
		},
		onShow() {
			this.getLang()
		},
		methods: {
			setImage(IMAGE) {
				if (IMAGE) {
					if (IMAGE.slice(-3) === 'png' || IMAGE.slice(-3) === 'jpg') {
						return this.IMGURL + IMAGE
					} else {
						return IMAGE
					}
				} else {
					return IMAGE
				}

			},
			// 切换视频和图片的显示和隐藏
			// isShow  为真显示图片   假显示视频
			handeleQitem(index) {
				if (index === 1) {
					this.QIndex = 0
					this.isShow = true
				} else {
					this.QIndex = 1
					this.isShow = false
				}
			},
			// vip弹窗关闭
			clickVipPopup() {
				this.vipShow = false
			},
			// 
			handeleVip() {

				this.$u.api.user.appCheck().then(res => {
					this.report = res.report
					this.vip = res.vip
				})
			},

			// 电话联系
			call() {
				// 不是自己  不是会员  中国人   打电话限制
				if (this.mineuser.id != this.user.id) {
					if (this.mineuser.level == 0) {
						if (this.lang == 'zh') {
							if (this.vip) {
								this.vipShow = true // 弹出vip购买弹窗
								// uni.showModal({
								// 	content: this.$t('您的权限不足哦!请联系工作人员!'),
								// 	showCancel: false,
								// 	confirmText: this.$t('是'),
								// })
								return
							} else {
								uni.showModal({
									content: this.$t('您的权限不足哦!请联系工作人员!'),
									showCancel: false,
									confirmText: this.$t('是'),
								})
								return false;
							}
							return false;
						}
					}
				}


				let mobile = this.user.mobile
				let firstChar = mobile.slice(0, 1);
				if (firstChar == 1) {
					uni.makePhoneCall({
						phoneNumber: this.user.mobile,
						success: (res) => {},
						fail: (err) => {}
					})
				} else if (firstChar == 9) {
					uni.makePhoneCall({
						phoneNumber: '+7' + mobile,
						success: (res) => {},
						fail: (err) => {}
					})
				} else if (firstChar == 8) {
					uni.makePhoneCall({
						phoneNumber: '+7' + mobile.slice(1),
						success: (res) => {},
						fail: (err) => {}
					})
				} else if (firstChar == 7) {
					uni.makePhoneCall({
						phoneNumber: '+' + mobile,
						success: (res) => {},
						fail: (err) => {}
					})
				} else {
					uni.makePhoneCall({
						phoneNumber: this.user.mobile,
						success: (res) => {},
						fail: (err) => {}
					})
				}
			},
			// 即时通讯
			handeleCommunication() {
				createC2CConversation(this.user.mobile, this)
			},
			videoErrorCallback(e) {},
			playVideo() {
				let plat = uni.getStorageSync('plat')

				if (plat == 'app') {
					this.show2 = true
					this.videoContext.requestFullScreen();
					this.isFullScreen = true;
					this.is_full = 1
				}
			},
			fullscreenchange(event) {
				if (!event.detail.fullScreen) {
					this.videoContext.pause()
					this.videoContext.seek(0)
					this.show2 = false
					this.is_full = 0
				} else {
					this.is_full = 1
				}
			},
			getLang() {
				// 获取缓存lang当前语言值
				uni.getStorage({
					key: 'lang',
					success: res => {
						if (res.data == 'zh') { //zh为中国，赋值0
							// this.indexID = 0
							// this.countryID = 0
							this.lang = 'zh'
						} else { //其他为俄罗斯，赋值1
							// this.indexID = 1
							// this.countryID = 1
							this.lang = 'ru'
						}
					}
				});
			},
			// 获取用户信息
			getData() {
				uni.showLoading({
					title: "Loading...",
					mask: true
				})
				let data = {
					user_id: this.id,
					type: 1,
					from: this.from
				}
				this.$u.api.user.getUserHomepage(data).then(res => {
					this.userInfo= res.userInfo, //用户信息
					this.evaluate=res.evaluate,//评价
					this.list=res.list,
					this.guanzhu=res.guanzhu,//是否被关注过
					this.mineuser=res.mineuser,
					this.kouan=res.kouan,//口岸
					this.luxian=res.luxian,//路线
					this.user_transport=res.user_transport,//运输工具
					this.warehouse=res.warehouse,//仓库
					this.user_goods = res.user_goods //在售商品
					console.log('角色名称:', res);
					// role: 7, //1货运代理  2国际物流公司 3司机 4业务员 5服务公司 6采购商 7供应商
					switch (res.userInfo.identity_name) {
						case '供应商':
						case '供应商(在俄)':
							console.log('供应商')
							this.role = 7
							break;
						case '采购商':
						case '采购商(在俄)':
							console.log('采购商')
							this.role = 6
							break;
						case '服务商':
						case '服务商(在俄)':
							console.log('服务商')
							this.role = 5
							break;
						case '货代公司':
						case '货代公司(在俄)':
							console.log('货代公司')
							this.role = 1
							break;
						case '运输公司':
						case '运输公司(在俄)':
							this.role = 3
							break;
						case 6:
							
					}
					console.log('this.evaluate:',this.evaluate);
					uni.hideLoading();
				}).catch(err => {
					uni.hideLoading();
				})
			}

		},
		onReady() {
			uni.setNavigationBarTitle({
				title: this.$t("个人主页")
			})
		},
	}
</script>

<style scoped>
	.user_imgs {
		width: 750rpx;
		height: 326rpx;
	}

	/* ---------------------------------------------------------------------------- */
	.qitems_active {
		width: 150rpx;
		height: 70rpx;
		background-color: #999999;
		text-align: center;
		line-height: 70rpx;
		color: #FFFFFF;
	}

	.qitems {
		width: 150rpx;
		height: 70rpx;
		background-color: #000;
		text-align: center;
		line-height: 70rpx;
		color: #FFFFFF;
	}

	.triangle {
		width: 0;
		height: 0;
		border-left: 50rpx solid transparent;
		border-right: 50rpx solid transparent;
		border-bottom: 50rpx solid #3498db;
		/* 三角形颜色 */
	}

	.home_cover {
		width: 100%;
		height: 120rpx;
		background-color: red;
		position: absolute;
		top: 100rpx;
	}

	.switchImage {
		font-size: 26rpx;
		position: absolute;
		top: 344rpx;
		left: 30rpx;
		width: 190rpx;
		height: 50rpx;
		// background-color: blue;
		display: flex;
		align-items: center;
		justify-content: space-between;
		z-index: 150;
	}

	.switchVideo {
		font-size: 26rpx;
		position: absolute;
		top: 344rpx;
		right: 30rpx;
		width: 190rpx;
		height: 50rpx;
		// background-color: blue;
		display: flex;
		align-items: center;
		justify-content: space-between;
		z-index: 150;
	}

	.my_images {
		width: 100%;
		height: 455rpx;
		background-color: #000000;
		z-index: 10;
	}

	.my_information_block {
		width: 650rpx;
		height: 72rpx;
		border-bottom: 1rpx solid #D8D8D8;
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: 26rpx;
	}

	.my_introduce_block {
		width: 650rpx;
		height: 89rpx;
		border-radius: 8rpx;
		background: #F6F6F6;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.my_introduce_title {
		width: 100%;
		height: 54rpx;
		display: flex;
		align-items: center;
		font-size: 26rpx;
	}

	.right_bottom {
		position: absolute;
		top: 0;
		left: 0;
		width: 392rpx;
		height: 44rpx;
		display: flex;
		align-items: center;
	}

	.right_top {
		width: 500rpx;
		height: 48rpx;
		text-overflow: ellipsis;
		overflow: hidden;
		word-break: break-all;
		white-space: nowrap;
	}

	.my_active_right_bottom {
		width: 100%;
		height: 45rpx;
		display: flex;
		justify-content: flex-end;
	}

	.my_active_right_top {
		width: 100%;
		height: 48rpx;
		display: flex;
		align-items: center;
		font-size: 26rpx;
		margin-top: 12rpx;
	}

	.my_active_right {
		width: 554rpx;
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	.my_logo {
		width: 136rpx;
		height: 124rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	._button {
		width: 326rpx;
		height: 93rpx;
		background-color: #000000;
		border-radius: 16rpx;
		color: #FFFFFF;
		font-size: 28rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.my_button {
		width: calc(100% - 60rpx);
		height: 93rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 130rpx;
		margin-bottom: 77rpx;
		z-index: 100;
	}

	.my_information {
		width: calc(100% - 60rpx);
		height: 400rpx;
		background: #FFFFFF;
		border-radius: 8rpx;
		margin-top: 10rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		z-index: 100;
	}

	.my_introduce {
		width: calc(100% - 60rpx);
		height: 305rpx;
		border-radius: 8rpx;
		background-color: #FFFFFF;
		margin-top: 10rpx;
		padding: 0 20rpx 0 20rpx;
		display: flex;
		flex-direction: column;
		z-index: 100;
	}

	.my_company {
		width: calc(100% - 60rpx);
		height: 124rpx;
		border-radius: 16rpx;
		background-color: #ffffff;
		margin-top: 10rpx;
		display: flex;
		z-index: 9999999999;
	}

	.my_content {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
</style>
<style>
	page {
		background: #F6F6F6;
	}
</style>